<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

		<title></title>
		<script src="../../js/mui.min.js"></script>
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<script src="../../js/getURLParam.js"></script>
		<link rel="stylesheet" href="../../css/global.css">
		<style>
			html,
			body {
				background-color: #efeff4;
			}
			/*控制a标签样式*/
			a:link {color:#000000}

			a:hover {color:#000000}
			
			a:visited {color:#000000}
			
			a:active {color:#000000}
		</style>
	</head>

	<body>
        <div id="pullrefresh" class="mui-content mui-scroll-wrapper">
			<div class="mui-scroll" >
				<!--数据列表-->
				<ul class="mui-table-view mui-table-view-chevron" id="attention">
					
				</ul>
			</div>
		</div>
	</body>
	<script type="text/javascript" charset="utf-8">
			//mui初始化 
			mui.init({
				pullRefresh: {
					container: '#pullrefresh',
					down: {
						callback: pulldownRefresh
					},
					up: { 
						contentrefresh: '正在加载...',
						callback: pullupRefresh,
						auto:true
					}
				},
				 gestureConfig:{
				   tap: true, //默认为true
				   doubletap: false, //默认为false
				   longtap: true, //默认为false
				 /*  swipe: true, //默认为true
				   drag: true, //默认为true
				   hold:false,//默认为false，不监听
				   release:false//默认为false，不监听*/
			  	}
			});
			/**  
			 * 下拉刷新具体业务实现
			 */
			function pulldownRefresh() {
				setTimeout(function() {
					pagerCode=1;
					document.getElementById("attention").innerHTML="";
					getCarOemList();//是否有数据
					mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //关闭“正在刷新”雪花进度提示
					mui("#pullrefresh").pullRefresh().refresh(true);//重新启动上拉刷新
				}, 500);
			}
			/**
			 * 上拉加载具体业务实现
			 */
			function pullupRefresh() {
				setTimeout(function() {
					pagerCode++;
					flagbool=getCarOemList();//是否有数据
					//mui('#pullrefresh').pullRefresh().endPullupToRefresh(flagbool); //参数为true代表没有更多数据了。
				}, 500); 
			}
			//准备好之后开始加载数据
			var sessionid=GetQueryString("sessionid");
	        var accountid=GetQueryString("accountid");
	        var proversion=GetQueryString("proversion");
	        var ItemId=GetQueryString("oemId");//开关机状态
	        var isflt=GetQueryString("isflt");
	        var pagerCode=0;//页码
	        var pagerCount=15;//每次递增几条
	        var nowDate="";
	        (function($){
			  	nowDate=getNowFormatDate();
			  })(mui);
			   function getNowFormatDate() {
			    var date = new Date();
			    var seperator1 = "-";
			    var seperator2 = ":";
			    var month = date.getMonth() + 1;
			    var strDate = date.getDate();
			    if (month >= 1 && month <= 9) {
			        month = "0" + month;
			    }
			    if (strDate >= 0 && strDate <= 9) {
			        strDate = "0" + strDate;
			    }
			  	var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate;
				return currentdate;
				}
	 		//品牌分组
			function getCarOemList(){
				var ulelementHtml=document.getElementById("attention");
				var type=3;
				var vclides="";
	       		var lnges ="";
	       	 	var lanes ="";
				var flagbool=false;//判断是否还有数据
				mui.ajax('../../../APP/vclListDetail',{
				data:{param:'{"proVersion":"'+proversion+'","accountId":"'+accountid+'","sessionid":"'+sessionid+'","data":{"type":"'+type+'","pageCode":"'+pagerCode+'","PageLength":"'+pagerCount+'","ItemId":"'+ItemId+'"}}'},
				dataType:'jsonp',//服务器返回json格式数据
				type:'post',//HTTP请求类型
				timeout:1000000,//超时时间设置为10秒；
				success:function(data){
					var jsonObj = window.JSON.parse(data);
					if(jsonObj.resultcode=="1"){
						//获取返回数据的data
						var resultdata = jsonObj.data
								if(resultdata.length>0){
								//获取每台设备的数据
								for(var i=0;i<resultdata.length;i++){
										var flt = "";
										var li = document.createElement('li');
										li.setAttribute("id","id_"+resultdata[i].vclid+"_"+resultdata[i].isatn+"_"+resultdata[i].vclnum)
										li.className="mui-table-view-cell";
										li.style.paddingBottom="5px";
										li.style.paddingTop="5px";
										li.style.paddingRight="10px";
										//flt+='<div class="mui-col-xs-10" >'
										flt+='<h5 class="mui-ellipsis">'
										flt+='<p style="display: inline;"><span style="width:50%;font-size:16px;color:black">'+resultdata[i].vclnum
									
										if(resultdata[i].isatn=="1"){//关注
			  							flt+='&nbsp;<img style="vertical-align:top;width:15px;height;auto" src="../../images/drawable-hdpi/attention.png">';
			  							}
			  							if(resultdata[i].isflt=="1"&&isflt=="1"){//四级故障
			  							flt+='&nbsp;<img style="vertical-align:top;width:15px;height;auto" src="../../images/drawable-hdpi/failure.png">';
			  							}
			  							if(resultdata[i].keysta!="1"){//关机
			  							flt+='&nbsp;<img style="vertical-align:top;width:15px;height;auto" src="../../images/drawable-hdpi/park.png">';
			  							}
			  							flt+='</span>'
			  							if(resultdata[i].vclspeed==null||resultdata[i].vclspeed==""){
			  								flt+='<span style="float:right;text-align:center;width:50%;text-align:right">0.0km/h&nbsp;&nbsp;';
			  							}else{
			  								flt+='<span style="float:right;text-align:center;width:50%;text-align:right">'+resultdata[i].vclspeed+'km/h&nbsp;&nbsp;';
			  							}
			  							
			  							if(null!=resultdata[i].pstime){
					  							if(nowDate==resultdata[i].pstime.substring(0,10)){
					  								flt+=resultdata[i].pstime.substring(11,16);
					  							}else{
					  								var timeString=resultdata[i].pstime.substring(5,10);
					  								var timeArray=timeString.split("-");
					  								if(timeArray[0].indexOf("0")==0){
					  									timeArray[0]=timeArray[0].substring(1)+"月";
					  								}else{
					  									timeArray[0]=timeArray[0]+"月";
					  								}
					  								if(timeArray[1].indexOf("0")==0){
					  									timeArray[1]=timeArray[1].substring(1)+"号";
					  								}else{
					  									timeArray[1]=timeArray[1]+"号";
					  								}
					  								flt+=timeArray[0]+timeArray[1]
					  							}
						  					}
			  							flt+='</span>';
			  							flt+='</p>';
			  							flt+='<p style="font-size: 13px;color: grey;padding-top:3px" id="a_'+resultdata[i].vclid+'">正在加载...</p>';
			  							flt+='</h5>';
										li.innerHTML=flt;
										ulelementHtml.appendChild(li);
										vclides+=resultdata[i].vclid+",";
							  			lnges+=resultdata[i].lng+",";
							  			lanes+=resultdata[i].lat+",";
							  		li.addEventListener("tap",function(){
							  			var vclid = this.getAttribute("id").split("_")[1];
							  			var vclnum = this.getAttribute("id").split("_")[3];
							  			window.webkit.messageHandlers.vclState.postMessage(vclid+"_"+vclnum);
							  		});
						  			li.addEventListener("longtap",function(){
									var li_vclid=this.getAttribute("id").split("_")[1];//设备id id_vclid_atn
									var li_atn=this.getAttribute("id").split("_")[2];//关注
									var btnArray = ['取消', '确定'];
									var con = "";
							    	var atnType="";
							    	if(li_atn=="1"){//点击按钮为取消关注
							    		con="取消关注";
							    		atnType="0";
							    	}else{//点击按钮为添加关注
							    		con="添加关注";
							    		atnType="1";
							    	}
							    	mui.confirm('', con, btnArray, function(e) {
										if (e.index == 1) {
											//ajax请求关注接口
											mui.ajax('../../../APP/atnFtn', {
												
												data: {
													param: '{"proVersion":"' + proversion + '","accountId":"' + accountid + '","sessionid":"' + sessionid + '","data":{"vclId":"'+li_vclid+'","type":"'+atnType+'"}}'
												},
												dataType: 'jsonp', //服务器返回json格式数据
												type: 'post', //HTTP请求类型
												timeout: 10000, //超时时间设置为10秒；
												success: function(data) {
													var jsonObj = window.JSON.parse(data);
													if (jsonObj.resultCode == "1") {
														getVclStateList();
														mui.toast("成功");
													}else if(jsonObj.resultCode == "116"){
														mui.toast("已超出关注车辆数100台");
													}else if(jsonObj.resultCode == "212"){
														mui.toast("此台车已经被关注");
													} else {
														mui.toast("失败");
													}
												},
												error: function(xhr, type, errorThrown) {
													}
												
											});
										} else {
											//mui.toast('你取消了解除绑定');
										}
									});
								});
								}
								
								vclids=vclides
								lngs=lnges
								lans=lanes
								mui('#pullrefresh').pullRefresh().endPullupToRefresh(false);
								getPosition();
								
							}else{
								mui('#pullrefresh').pullRefresh().endPullupToRefresh(true); //参数为true代表没有更多数据了。;
							}
					}else{
						ulelementHtml.innerHTML="请求出错!"+jsonObj.resultcode;
					}
				},
				error:function(xhr,type,errorThrown){
					//异常处理；
					ulelementHtml.innerHTML="error";
				}
				
			});
			return flagbool;
			}
			function getPosition(){
							mui.ajax('../../../APP/position',{
				data:{param:'{"proVersion":"'+proversion+'","accountId":"'+accountid+'","sessionid":"'+sessionid+'","data":{"vclids":"'+vclids+'","lngs":"'+lngs+'","lans":"'+lans+'"}}'},
				dataType:'jsonp',//服务器返回json格式数据
				type:'post',//HTTP请求类型
				timeout:10000,//超时时间设置为10秒；
				success:function(data){
					var jsonObj = window.JSON.parse(data);
					//document.getElementById("test").innerHTML="bb";
					if(jsonObj.resultcode=="1"){
						//document.getElementById("test").innerHTML=jsonObj.resultcode;
						//获取返回数据的data
						var resultdata = jsonObj.data;
							if(null !=resultdata){
								//document.getElementById("test").innerHTML="chang";
								for(var i=0;i<resultdata.length;i++){
									var arr = resultdata[i];
									//document.getElementById("test").innerHTML=resultdata[i][1];
										document.getElementById("a_"+resultdata[i][0]).innerHTML=resultdata[i][1];
									
								}
							}else{
								//document.getElementById("test").innerHTML="null";
							}
						
					}else{
						//document.getElementById("test").innerHTML="null2";
					}
				},
				error:function(xhr,type,errorThrown){
					//异常处理；
					//document.getElementById("test").innerHTML=="error";
				}
			});
			}
			</script>
</html>